import React from 'react'
import { Popup, CalendarPicker } from 'antd-mobile'
import dayjs from 'dayjs'
import { citySetDate } from '../../../reducers/citySlice'
import { useDispatch } from 'react-redux'


function DatePopup({visible1, setVisible1}) {
    const dispatch = useDispatch()
    return (
        <CalendarPicker
            visible={visible1}
            selectionMode='single'
            onClose={() => setVisible1(false)}
            onMaskClick={() => setVisible1(false)}

            min={new Date()} // 设置最小可选的日期
            // dayjs()这个不传值表示的是当前时间
            // .add(14, 'day)表示 当前天加14天， day表示的是天
            // valueOf() 表示的是时间戳
            max={dayjs().add(14,'day').valueOf()} // 设置最大可选的日期

            // 得到确定后的日期，转换成年月日，并存储到redux中
            onConfirm={(value) => {
                const nDate = dayjs(value).format('YYYY-MM-DD')
                dispatch(citySetDate(nDate))
            }}
        />
  )
}

export default DatePopup
